﻿//ContextMenu.js
 function CustomContextMenu(Arguments)
    {
    //Global variables.
	var Base = Arguments.Base ? Arguments.Base : document.documentElement;
	var Width = Arguments.Width ? Arguments.Width : 120;            //set the width of the context menu
   	var HoverFontColor = Arguments.HoverFontColor ? Arguments.HoverFontColor : '#507cd1';
	var HoverBackgroundColor = Arguments.HoverBackgroundColor ? Arguments.HoverBackgroundColor : '#507cd1';
	var HoverBorderColor = Arguments.HoverBorderColor ? Arguments.HoverBorderColor : 'orange';
	var ClickEventListener = Arguments.ClickEventListener ? Arguments.ClickEventListener : function(){ return false; };
	
    var ContextMenuDiv = document.createElement('div');
    var ContextMenuTable = document.createElement('table');
    var Index = 0;
    var EventHandlers = new Array();
	var prof_name=null;
	
	
	//Style Context Menu div.                 //the entire context menu
    ContextMenuDiv.id = 'ContextMenu'; 
    ContextMenuDiv.style.position = 'absolute';
    ContextMenuDiv.style.backgroundColor = '#507cd1';
    ContextMenuDiv.style.border = '2px groove gray';  //1 px border thickenss orange background of context menu
    ContextMenuDiv.style.verticalAlign = 'top';
    ContextMenuDiv.style.textAlign = 'left';
	ContextMenuDiv.style.visibility = 'hidden';
	ContextMenuDiv.style.width = (Width + 11) + 'px';
	
	
	//Styles Context Menu table.
	ContextMenuTable.id = 'ContextMenuTable'; 
	ContextMenuTable.style.width = (Width + 10) + 'px';
	ContextMenuTable.border = 0;
	ContextMenuTable.cellPadding = 0;
	ContextMenuTable.cellSpacing = 0;
	ContextMenuTable.style.marginTop = '1px';
	ContextMenuTable.style.marginBottom = '1px';
	
	//Append Context Menu table into Context Menu div.
	ContextMenuDiv.appendChild(ContextMenuTable);
	
	//Public method for adding Context Menu Items.
	this.AddItem = function(imgSrc,imgSize, itemText, isDisabled, commandName)
	{	    
		var Tr = ContextMenuTable.insertRow(Index++);   //table row names
	    Tr.style.fontFamily = 'Microsoft Sans Serif';
	    Tr.style.fontSize = 'XX-Small';           //set Font size
	    Tr.style.fontWeight = 'normal';
	    Tr.style.backgroundColor = '#507cd1';
	    Tr.style.color = isDisabled ? '#507cd1' : '#507cd1';
	    Tr.style.cursor = 'default';
		
	    var TdLeft = Tr.insertCell(0);  //table row image
	    TdLeft.style.width = 15 + 'px';
	    TdLeft.style.height = 15 + 'px';
	    TdLeft.style.textAlign = 'center';
	    TdLeft.style.borderTop = '1px solid #507cd1';    //the #507cd1 borders around image
	    TdLeft.style.borderBottom = '1px solid #507cd1';
	    TdLeft.style.borderLeft = '1px solid #507cd1';
	    TdLeft.style.backgroundColor = '#507cd1';
		
	  
		
	    var TdRight = Tr.insertCell(1);     //text
	    TdRight.style.width = (Width-15) + 'px';
	    TdRight.style.height = 15 + 'px';
	    TdRight.style.textAlign = 'left';
	 	     
	    TdRight.innerHTML = '&nbsp;&nbsp;&nbsp;' + itemText;
	    TdRight.style.borderTop = '1px solid #507cd1';
	    TdRight.style.borderBottom = '1px solid #507cd1';
	    TdRight.style.borderRight = '1px solid #507cd1';
	    TdRight.style.color='white';
		
		if(imgSrc)
		{
	        var Img = new Image();	 
	        Img.id = 'Img';    
	        Img.src = imgSrc;
	        Img.style.width = imgSize + 'px';	 //set image width here
	        Img.style.height = imgSize + 'px';	 //set image height here
	        Img.disabled = isDisabled; 
			
	        TdLeft.appendChild(Img);	
	    }
	    else
	        TdLeft.innerHTML = '&nbsp;';
		
	    //Register events.	    
	    if(!isDisabled)
		{	        
			WireUpEventHandler(Tr, 'click', function(){ ClickEventListener(Tr, {CommandName: commandName, Text: itemText, IsDisabled: isDisabled, ImageUrl: Img ? Img.src : ''}) });
			WireUpEventHandler(Tr, 'mouseover', function(){ MouseOver(Tr, TdLeft, TdRight); });
	        WireUpEventHandler(Tr, 'mouseout', function(){ MouseOut(Tr, TdLeft, TdRight); });
	    }
		else
	    {
			WireUpEventHandler(Tr, 'click', function(){ return false; });
	        WireUpEventHandler(TdRight, 'selectstart', function(){ return false; });
	    }
	}	
	
	//Public method for adding Separator Menu Items.
	this.AddSeparatorItem = function()     //use this function for adding separator
	{
	    var Tr = ContextMenuTable.insertRow(Index++);
	    Tr.style.cursor = 'default';
	    
	    var TdLeft = Tr.insertCell(0);
	    TdLeft.style.width = 25 + 'px';
	    TdLeft.style.height = '1px';
	    TdLeft.style.backgroundColor = '#E8E3DB';
		
	   	    
	    var TdRight = Tr.insertCell(2);
	    TdRight.style.width = (Width - 25) + 'px';
	    TdRight.style.height = '1px';
	    TdRight.style.backgroundColor = '#507cd1';
	}
	
	
	//Public method for displaying Context Menu.
	this.Display = function(e,name)
	{
	    prof_name=name;
	    e = e ? e : window.event;	    
		//alert(name);
	    var xLeft = e.clientX;
		if(xLeft + ContextMenuDiv.offsetWidth > Base.offsetWidth)
			xLeft = Base.offsetWidth - ContextMenuDiv.offsetWidth;
		
		var yTop = e.clientY;
		if(yTop + ContextMenuDiv.offsetHeight > Base.clientHeight)
			yTop = Base.clientHeight - ContextMenuDiv.offsetHeight;	
		
	    ContextMenuDiv.style.visibility = 'hidden';
	    ContextMenuDiv.style.left = xLeft + 'px';    //this sets the position of the context menu as you click the options
        ContextMenuDiv.style.top = yTop + 'px';
        ContextMenuDiv.style.visibility = 'visible';
        
        return false;
	}	
	
   
    this.profileOf=function()
    {
    return prof_name;
    }
   
   
     
	//Public method to hide context Menu.
	this.Hide = function()
	{
		ContextMenuDiv.style.visibility='hidden';
	}
	
	//Public method Dispose.
	this.Dispose = function()
	{
	    while(EventHandlers.length > 0)
	        DetachEventHandler(EventHandlers.pop());
			
	    document.body.removeChild(ContextMenuDiv);
	}
	
	//Public method GetTotalItems.
	this.GetTotalItems = function()
	{
	    return ContextMenuTable.getElementsByTagName('tr').length;
	}
	
	//Mouseover event handler
	var MouseOver = function(Tr, TdLeft, TdRight)
	{	
	     
	     Tr.style.color = '#507cd1';
	     Tr.style.backgroundColor = 'orange';
		
	    
	     TdLeft.style.backgroundColor = '#7db3ff';
	     TdLeft.style.borderTop = '1px solid white';    //the #666666 borders around image
	     TdLeft.style.borderBottom = '1px solid white';
	   
	
	        
	    
	     TdRight.style.backgroundColor='#7db3ff';
	     TdRight.style.borderTop = '1px solid white';    //the #666666 borders around image
	     TdRight.style.borderBottom = '1px solid white';
	   
	    
	     TdRight.style.color = 'white'; 
	     
	}
	
	//Mouseout event handler
	var MouseOut = function(Tr, TdLeft, TdRight)
	{	
	  
	     Tr.style.backgroundColor = '#507cd1';
	        
	   
	     TdLeft.style.borderTopColor = '#507cd1';
	     TdLeft.style.borderBottomColor = '#507cd1';
	     TdLeft.style.borderLeftColor = '#507cd1';
	     TdLeft.style.backgroundColor = '#507cd1';
					
	     TdRight.style.backgroundColor='#507cd1';
	     TdRight.style.borderTop = '1px solid #507cd1';    //the #666666 borders around image
	     TdRight.style.borderBottom = '1px solid #507cd1';
	  
	     TdRight.style.color = 'white'; 
	}
	
	//Private method to wire up event handlers.
	var WireUpEventHandler = function(Target, Event, Listener)
	{
	    //Register event.
	    if(Target.addEventListener)	   
			Target.addEventListener(Event, Listener, false);	    
	    else if(Target.attachEvent)	   
			Target.attachEvent('on' + Event, Listener);
	    else 
	    {
			Event = 'on' + Event;
			Target.Event = Listener;	 
		}
		
	    //Collect 皜vent information through object literal.
	    var EVENT = { Target: Target, Event: Event, Listener: Listener }
	    EventHandlers.push(EVENT);
	}
	
	//Private method to detach event handlers.
	var DetachEventHandler = function(EVENT)
	{
	    if(EVENT.Target.removeEventListener)	   
			EVENT.Target.removeEventListener(EVENT.Event, EVENT.Listener, false);	    
	    else if(EVENT.Target.detachEvent)	   
	        EVENT.Target.detachEvent('on' + EVENT.Event, EVENT.Listener);
	    else 
	    {
			EVENT.Event = 'on' + EVENT.Event;
			EVENT.Target.EVENT.Event = null;	 
	    }
	}
	
	//Add Context Menu div on the document.
	document.body.appendChild(ContextMenuDiv);
	
	//Register events.	
	WireUpEventHandler(Base, 'click', this.Hide);
	WireUpEventHandler(ContextMenuDiv, 'contextmenu', function(){ return false; });
}